define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-theme', 'template'], function ($, undefined, Backend, Table, Form, Echarts) {
    var Controller = {
        myChart1: function () {
            // 指定图表的配置项和数据
            let option = {
                title: {
                    text: '订单趋势',
                    subtext: ''
                },
                tooltip: {
                    trigger: 'axis'
                },
                legend: {
                    data: ['订单数']
                },
                toolbox: {
                    show: true,
                    feature: {
                        dataView: {
                            show: true,
                            readOnly: false
                        },
                        magicType: {
                            show: true,
                            type: ['line', 'bar']
                        },
                        restore: {
                            show: true
                        },
                        saveAsImage: {
                            show: true
                        }
                    }
                },
                calculable: true,
                xAxis: {
                    type: 'category',
                    boundaryGap: false,
                    data: []
                },
                yAxis: {},
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                series: [{
                    name: '订单数',
                    type: 'line',
                    data: [],
                    markPoint: {
                        data: [{
                            type: 'max',
                            name: '最大值'
                        },
                            {
                                type: 'min',
                                name: '最小值'
                            }
                        ]
                    },
                    markLine: {
                        data: [{
                            type: 'average',
                            name: '平均值'
                        }]
                    }
                }]
            };

            // 初始化图表
            let myChart = Echarts.init($('#echarts1')[0], 'walden');
            myChart.setOption(option);

            var date = '';

            // 时间范围回调
            $("#form1 .datetimerange").data("callback", function (start, end) {
                date = start.format(this.locale.format) + " - " + end.format(this.locale.format);
                $(this.element).val(date);
                refresh();
            });

            var si = null;

            function refresh() {
                si && clearTimeout(si);
                si = setTimeout(function () {
                    Fast.api.ajax({
                        url: 'yungift/dashboard/orderStat',
                        data: {
                            date: date,
                        },
                        loading: false
                    }, function (res) {
                        option.xAxis.data = res.categoryList;
                        option.series[0].data = res.orderCountList;
                        myChart.clear();
                        myChart.setOption(option, true);

                        return false;
                    });
                }, 50);
            }

            return {
                chart: myChart,
                refresh: refresh
            };
        },
        myChart2: function () {
            var option = {
                title: {
                    text: '近一周订单统计',
                    subtext: ''
                },
                tooltip: {
                    trigger: 'axis',
                    formatter: "{b}<br>{a0} : {c0} 个 <br>{a1} : {c1} 元"
                },
                legend: {
                    data: ['订单额', '订单数']
                },
                toolbox: {
                    show: true,
                    feature: {
                        dataView: {show: true, readOnly: false},
                        magicType: {show: true, type: ['line', 'bar']},
                        restore: {show: true},
                        saveAsImage: {show: true}
                    }
                },
                calculable: true,
                xAxis: {
                    type: 'category',
                    boundaryGap: false,
                    data: []
                },
                yAxis: [
                    {
                        type: 'value'
                    }
                ],
                series: [
                    {
                        name: '订单数',
                        type: 'line',
                        data: [],
                        markPoint: {
                            data: [
                                {type: 'max', name: '最大值'},
                                {type: 'min', name: '最小值'}
                            ]
                        },
                        markLine: {
                            data: [
                                {type: 'average', name: '平均值'}
                            ]
                        }
                    },
                    {
                        name: '订单额',
                        type: 'bar',
                        smooth: true,
                        symbol: 'none',
                        data: [],
                        markPoint: {
                            data: [
                                {type: 'max', name: '最大值'},
                                {type: 'min', name: '最小值'}
                            ]
                        },
                        markLine: {
                            data: [
                                {type: 'average', name: '平均值'}
                            ]
                        }
                    }
                ]
            };

            var myChart = Echarts.init($('#echarts2')[0], 'walden');
            myChart.setOption(option);

            function loadData(categoryList, amountList, countList) {
                console.log('loadData', categoryList, amountList, countList)
                option.xAxis.data = categoryList;
                option.series[0].data = amountList;
                option.series[1].data = countList;
                myChart.clear();
                myChart.setOption(option, true);
            }

            return {
                chart: myChart,
                loadData: loadData
            };
        },
        myChart3: function () {
            var option = {
                title: {
                    text: '礼币统计',
                    x: 'center'
                },
                tooltip: {
                    trigger: 'item',
                },
                legend: {
                    orient: 'vertical',
                    left: 'left',
                },
                series: [
                    {
                        name: '礼币数',
                        type: 'pie',
                        radius: '50%',
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        },
                        data: []
                    },
                ]
            };

            var myChart = Echarts.init($('#echarts3')[0], 'walden');
            myChart.setOption(option);

            function loadData(dataList) {
                option.series[0].data = dataList;
                myChart.clear();
                myChart.setOption(option, true);
            }

            return {
                chart: myChart,
                loadData
            };
        },
        index: function () {
            let charts = {}
            charts.chart1 = this.myChart1();
            charts.chart2 = this.myChart2();
            charts.chart3 = this.myChart3();

            // 加载活动数据
            var loadActivityData = function (activityId) {
                Fast.api.ajax({
                    url: 'yungift/dashboard/activityData',
                    data: {
                        activity_id: activityId,
                    },
                    loading: false
                }, function (res) {
                    $('#activity_data').html(Template('activity_data_tpl', res));
                    charts.chart2.loadData(res.orderCategoryList, res.orderAmountList, res.orderCountList);
                    charts.chart3.loadData(res.fundAmountGroup);

                    return false;
                });
            }

            // 自动刷新页面
            setTimeout(function () {
                $('#form1 .btn-filter:eq(3)').trigger('click');
            }, 1000);

            // 获取活动数据
            loadActivityData(Config.activityId);

            // 自适应
            $(window).resize(function () {
                for (let i in charts) {
                    charts[i].chart.resize();
                }
            });

            // 点击刷新
            $(document).on("click", "a.btn-refresh", function () {
                let val = $(this).data('chart');
                charts[val].chart.resize();
                charts[val].refresh();
            });

            // 每隔60s定时刷新图表
            setInterval(function () {
                $(".btn-refresh").trigger("click");
            }, 60000);

            // 点击按钮，修改时间范围，触发表格刷新
            $(document).on("click", ".btn-filter", function () {
                var label = $(this).text();
                var obj = $(this).closest("form").find(".datetimerange").data("daterangepicker");
                var dates = obj.ranges[label];
                obj.startDate = dates[0];
                obj.endDate = dates[1];
                obj.clickApply();
            });

            // 选项卡切入事件
            $(document).on("click", "#resetecharts", function () {
                setTimeout(function () {
                    $(window).trigger("resize");
                }, 50);
            });

            // 选择活动
            $(document).on('change changed', "#c-activity_id", function () {
                let activityId = $('#c-activity_id').val();
                console.log('activityId', activityId);
                loadActivityData(activityId);
            })

            // 渲染form
            Form.api.bindevent($("#form1"));
            Form.api.bindevent($('.select-activity'));
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            }
        }
    };
    return Controller;
});